<div class="modal-header">
    <button type="button" class="close" ng-click="cancel()">&times;</button>
    <span class="bebas modal-title" style="color: #657B83;font-size: 19px">
        <i class="fa fa-newspaper-o"></i> &nbsp;{{modalHeaderTitle}}</span>
</div>

<div class="modal-body">
    <div class="alert alert-info" style="padding: 9px">
        <i style="font-size:40px; float: left;padding-right:10px; color: #3a87ad" class="fa fa-info-circle"></i>
        <span class="font-90em">
            Enter or edit details of the paper. To associate it with a folder, either paste
            the url of the folder or enter the folder name.
        </span>
    </div>

    <form>
        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Title</label>

            <div class="col-sm-9">
                <input type="text" style="width: 423px" ng-model="newManuscript.title">
            </div>
        </div>

        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Author first name</label>

            <div class="col-sm-9">
                <input type="text" placeholder="Corresponding author's first name" style="width: 350px"
                       ng-model="newManuscript.authorFirstName">
            </div>
        </div>

        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Author last name</label>

            <div class="col-sm-9">
                <input type="text" placeholder="Corresponding author's last name" style="width: 350px"
                       ng-model="newManuscript.authorLastName">
            </div>
        </div>

        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Folder</label>

            <div class="col-sm-9">
                <input type="text" class="input_box" style="width: 260px; padding: 6px"
                       placeholder="Paste folder url or type folder name" ng-model="newManuscript.selectedFolderName"
                       typeahead-loading="loadingAddExistingData"
                       ng-paste="pasteFolder($event)"
                       uib-typeahead="result.folderName for result in filterFolders($viewValue)"
                       typeahead-editable="true"
                       typeahead-on-select="folderSelection($item, $model, $label)">

                <i ng-if="invalidFolder" class="fa fa-exclamation-triangle red font-12em"
                   uib-tooltip="Invalid folder"></i>

                <!--<input type="text" style="width: 423px" ng-model="newManuscript.folder" placeholder="Enter folder name">-->
            </div>
        </div>

        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Status</label>

            <div class="col-sm-9">
                <select ng-model="newManuscript.status" style="width: 150px; padding: 6px; border: 1px solid #f1f1f1">
                    <option value="UNDER_REVIEW">Under Review</option>
                    <option value="ACCEPTED">Accepted</option>
                    <option value="REJECTED">Rejected</option>
                </select>
            </div>
        </div>

        <div class="form-group row">
            <label class="col-sm-3 form-control-label">Paragon Plus url</label>

            <div class="col-sm-9">
                <input type="text" style="width: 423px" ng-model="newManuscript.paragonUrl">
            </div>
        </div>
    </form>
</div>

<div class="modal-footer">
    <button class="btn btn-default btn-sm" ng-click="cancel()">Cancel</button>
    <button class="btn btn-primary btn-sm" ng-disabled="!newManuscript.folder" ng-click="createNewPaper()">
        {{submitButtonText}}
    </button>
</div>